<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ page session="false"%>
<%@page pageEncoding="UTF-8" contentType="text/html; charset=UTF-8"%>
<html>
<head>
<title>Patient Page</title>
<style type="text/css">
.tg {
	border-collapse: collapse;
	border-spacing: 0;
	border-color: #ccc;
}

.tg td {
	font-family: Arial, sans-serif;
	font-size: 14px;
	padding: 10px 5px;
	border-style: solid;
	border-width: 1px;
	overflow: hidden;
	word-break: normal;
	border-color: #ccc;
	color: #333;
	background-color: #fff;
}

.tg th {
	font-family: Arial, sans-serif;
	font-size: 14px;
	font-weight: normal;
	padding: 10px 5px;
	border-style: solid;
	border-width: 1px;
	overflow: hidden;
	word-break: normal;
	border-color: #ccc;
	color: #333;
	background-color: #f0f0f0;
}

.tg .tg-4eph {
	background-color: #f9f9f9
}
</style>
<link href="<c:url value="/resources/css/jquery-ui.min.css" />" rel="stylesheet">
<script src="<c:url value="/resources/js/jquery-1.11.2.min.js" />"></script>
<script src="<c:url value="/resources/js/jquery-ui.min.js" />"></script>
<script src="<c:url value="/resources/js/patient.js" />"></script>

</head>
<body>
	<h1>Add a patient</h1>
	<c:if test="${!empty listcities}">
		<ul id="listCities" style="display:none">
			<c:forEach items="${listcities}" var="city">

				<li value="${city.id}">${city.cityName}</li>

			</c:forEach>
		</ul>
		<ul id="listDistricts" style="display:none">
			<c:forEach items="${listDistricts}" var="dist">

				<li value="${dist.id}" data-belongCities="${dist.belongToCity.id}">${dist.districtName}</li>

			</c:forEach>
		</ul>
	</c:if>
	<c:url var="aAction" value="/patient/add"></c:url>
	<form:form action="${aAction}" method="POST" commandName="patient">
		<table>
			<c:if test="${!empty message}">
				<tr>
					<td colspan="2">${message}</td>
				</tr>
			</c:if>
			<c:if test="${!empty patient.name}">
				<tr>
					<td><form:label path="id">
							<spring:message text="ID" />
						</form:label></td>
					<td><form:input path="id" readonly="true" size="8"
							disabled="true" /> <form:hidden path="id" /></td>
				</tr>
			</c:if>
			<tr>
				<td><form:label path="name">
						<spring:message text="Tên bệnh nhân " />
					</form:label></td>
				<td><form:input path="name" /></td>
			</tr>
			<tr>
				<fmt:formatDate value="${patient.dateOfBirth}" var="dobString" pattern="dd/MM/yyyy" />
				<td><form:label path="dateOfBirth">
						<spring:message text="Ngày tháng năm sinh " />
					</form:label></td>
				<td>
					<form:input path="dateOfBirth" value="${dobString}"/>
				</td>
			</tr>
			<tr>
				<td><form:label path="address">
						<spring:message text="Địa chỉ" />
					</form:label></td>
				<td><form:input path="address" /></td>
			</tr>
			<tr>
				<td><form:label path="belongToWard">
						<spring:message text="Xã Phường" />
					</form:label></td>
				<td>
					<c:if test="${!empty listWards}">
						<select id="belongToWard" name="belongToWard">
							<c:forEach items="${listWards}" var="ward">
				
								<option value="${ward.id}" data-belongDistrict="${ward.belongToDistrict.id}">${ward.wardName}</option>
				
							</c:forEach>
						</select>
						<div id="wardDetails"></div>
					</c:if>
				</td>
			</tr>
			<tr>
				<td colspan="2"><form:hidden path="belongToDoctor"
						value="${id_user}"></form:hidden> <c:if
						test="${!empty patient.name}">
						<input type="submit" value="<spring:message text="Edit Patient"/>" />
					</c:if> <c:if test="${empty patient.name}">
						<input type="submit" value="<spring:message text="Add Patient"/>" />
					</c:if></td>
			</tr>
		</table>
	</form:form>
	<br>
	<c:if test="${!empty listPatients}">
		<h3>listPatient List</h3>
		<table class="tg">
			<tr>
				<th width="80">Patient ID</th>
				<th width="120">Patient Name</th>
				<th width="120">Xã Phường</th>
				<th width="60">Edit</th>
				<th width="60">Delete</th>
			</tr>
			<c:forEach items="${listPatients}" var="pt">
				<tr>
					<td>${pt.id}</td>
					<td>${pt.name}</td>
					<td>${pt.belongToWard.wardName}</td>
					<td><a href="<c:url value='/patient/edit/${pt.id}' />">Edit</a></td>
					<td><a href="<c:url value='/patient/remove/${pt.id}' />">Delete</a></td>
				</tr>
			</c:forEach>
		</table>
	</c:if>
</body>
</html>